<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div>
 
	
	 <div>
    	<p>注册</p>
		<ul  id="line0">
		<li><input name="tel" id="r_email" value="" placeholder="请输入邮箱"></li>
		<li><input name="tel" id="r_password" value="" placeholder="请输入密码"></li>
		<li><input name="tel" id="r_name" value="" placeholder="请输入昵称"></li>
		<li><button onclick="register()">注册</button></li>
		</ul>
	</div>
	   <div>
    	<p>登录</p>
		<ul  id="line0">
		<li><input name="tel" id="phone" value="" placeholder="请输入邮箱号"></li>
		<li><input name="tel" id="password" value="" placeholder="请输入密码"></li>
		<li><button onclick="login()">登录</button></li>
		</ul>
	</div>
    <div>
        <p>界面显示</p>
        <ul  id="line1">
				<li>界面</li>
        </ul>
    </div>
   <div>
        <p><button onclick="getUserInfo()">获取自己的信息</button></p>
    </div>
    
   <div>
        <p>world</p>
        <ul id="world">
			<li>world</li>
			<li id="onlinenum">在线人数:0</li>
        </ul>
    </div>
   <div>
      <ul>
		    <li>消息<input type="text" id="worldmessage"></li>
      		<li><button onclick="PushWorldMessage()">发送</button></li>
        </ul>
    </div>
    
     <div>
        <p>添加好友</p>
        <ul>
		    <li>好友UID<input type="text" id="frienduid"></li>
      		<li><button onclick="addFriend()">发送</button></li>
        </ul>
    </div>
    
    <div>
        <p>好友聊天消息</p>
        <ul  id="friend">
			<li>friend</li>
        </ul>
    </div>
    
    <div>
        <p>好友列表</p>
        <ul  id="line2">

        </ul>
    </div>
    <div>
        <p>好友申请列表</p>
        <ul  id="line3">

        </ul>
    </div>
</div>

</body>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
	var wsServer = 'ws://'+document.domain+':8501';
	var websocket = new WebSocket(wsServer);
   	var token = "";
   	
   	
   	 
    window.onload = function () {
    	setCookie("shaketoken","123");
        websocket.onopen = function (evt) {
        	   console.log(evt.data);
        };

        websocket.onclose = function (evt) {
            addLine("ws 链接已经关闭");
        };

        websocket.onmessage = function (evt) {
      	    console.log("---------------onmessage-----------");
        	var obj = eval('('+ evt.data +')');
        	if(obj){
        		console.log(obj);
	            if(obj.code=="90003"){
	        		getFriendList();
	        	}else if(obj.code=="90004"){
	        		getFriendRequests();
	        	}if(obj.code=="90006"||obj.code=="90007"){
	        		changeStatus(obj.result,obj.code);
	        	}if(obj.code=="90009"){
	        		changeOnlineNum(obj.result,obj.code);
	        	}else if(obj.code=="90005"){
	        		addLine(evt.data,"world");
	        	}else{
	        		
	        	}
        	}else{
        	    //addLine(evt.data);
        	}
        };

        websocket.onerror = function (evt, e) {
            addLine('Error occured: ' + evt.data);
        };
    };
    function addLine(data,id) {
        $("#"+id).append("<li>"+data+"</li>");
    }
    function getUserInfo(){
    	
   	    msg = {
               action:'getUserInfo',
               content:{
               	Token:token,
               },Class:'User'
         };
        console.log(msg);
      
        websocket.send(JSON.stringify(msg));
    }
    function addFriend(){
    	msg = {
                action:'addFriend',
                content:{
                	Token:token,
                	FriendUid:$("#frienduid").val()
                },Class:'Friend'
          };
        console.log(msg);
        websocket.send(JSON.stringify(msg));
    }
    function register(){
	 	var email = $("#r_email").val();
	 	var password = $("#r_password").val();
		var name = $("#r_name").val();
	 	$.ajax({  
	         type: "GET",  
	         url: "/register",  
	         async: false, 
	         datatype:"json",
	         data:
	         {
	     		email:email,
	     		password:password,
	     		name:name
		     },  
	         success : function(data){  
	        	  console.log("---------------register-----------");
		           console.log(data);
	         	}
	     	}); 
    }
    
    function login (){
	 	var phone = $("#phone").val();
	 	var password = $("#password").val();
	 	$.ajax({  
	         type: "GET",  
	         url: "/login",  
	         async: false, 
	         datatype:"json",
	         data:
	         {
	     		account:phone,
	     		password:$("#password").val()
		     },  
	         success : function(data){  
	        	  console.log("---------------login-----------");
		           console.log(data);
		           token = data.result.token; 
		           //setCookie("Logintoken",token,1);
	 	           msg = {
	 	                  action:"openChat",
	 	                  content:{
	 	                  	Token:token,
	 	                  },Class:"User"
	 	            };
	           		websocket.send(JSON.stringify(msg));
	           		getFriendRequests();
	           		getFriendList();
	         	}
	     	}); 
 	}
    function chechIsLogin(token){
    	var flag =false;
	 	$.ajax({  
	         type: "GET",  
	         url: "/checkIsLogin",  
	         async: false, 
	         datatype:"json",
	         data:
	         {
	     		token:token,
		     },  
	         success : function(data){  
	        	   console.log("---------------checkIsLogin-----------");
		           console.log(data);
		           token = data.result.token; 
		           setCookie("Logintoken",token,1);
	 	           msg = {
	 	                  action:"openChat",
	 	                  content:{
	 	                  	Token:token,
	 	                  },Class:"User"
	 	            };
	           		websocket.send(JSON.stringify(msg));
	         	}
	     	});
    }
    
    function getFriendRequests(){
	 	$.ajax({  
	         type: "GET",  
	         url: "/getFriendRequests",  
	         async: false, 
	         datatype:"json",
	         data:
	         {
	     		token:token,
		     },  
	         success : function(data){  
	        	   console.log("---------------getFriendRequests-----------");
		           console.log(data);
		           $("#line3").html("");
		           var append = "";
		           $.each(data.result,function(index,e){
		        	   append+="<li>UID : "+e.fuid+" ,"+e.finfo.name+"申请添加\
		        	  <div id='"+e.id+"_pass'> <Button onclick=\"pass('"+e.id+"',2)\">同意</Button>\
		        	   <Button onclick=\"pass('"+e.id+"',3)\">拒绝</Button>\
		        	   </div></li>";
		           })
		           $("#line3").html(append);
	         	}
	     	});
    }
    function pass(id,status){
	 	$.ajax({  
	         type: "GET",  
	         url: "/dealFriendRequest",  
	         async: false, 
	         datatype:"json",
	         data:
	         {
	     		token:token,
	     		id:id,
	     		status:status
		     },  
	         success : function(data){  
	        	   console.log("---------------getFriendRequests-----------");
		           console.log(data);
		           if(status=="2"){
		        	   $("#"+id+"_pass").html("通过");
		           }else if(status=="3"){
		        	   $("#"+id+"_pass").html("拒绝");
		           }
		           getFriendList();
	         	}
	     	});
    }
    function getFriendList(){
    	
	 	$.ajax({  
	         type: "GET",  
	         url: "/getFriendList",  
	         async: false, 
	         datatype:"json",
	         data:
	         {
	     		token:token,
		     },  
	         success : function(data){  
	        	   console.log("---------------getFriendList-----------");
		           console.log(data);
		           $("#line2").html("");
		           var append = "";
		           $.each(data.result,function(index,e){
		        	   if(e.isonline=="1"){
		        		   var status = "在线";
		        	   }else if(e.isonline=="2"){
		        		   var status = "离线";
		        	   }
		        	   append+="<li>UID:"+e.fuid+" 昵称:"+e.finfo.name+" 状态:<span id='"+e.fuid+"_status'>("+status+")</span>\
		        	   <Button onclick=\"chat('"+e.fuid+"','chat_"+e.fuid+"')\">聊天</Button>\
		        	   <textarea id=\"chat_"+e.fuid+"\"></textarea>\
		        	   </li>";
		           })
		           $("#line2").html(append);
	         	}
	     	});
     
    }
    function chat(fuid,cid){
    	msg = {
                action:'PushMessageToFriend',
                content:{
                	Token:token,
                	FriendUid:fuid,
                	message:$("#"+cid).val()
                },Class:'Friend'
          };
        console.log(msg);
        websocket.send(JSON.stringify(msg));
    }
    function PushWorldMessage(){
    	msg = {
                action:'sendMsgToWorld',
                content:{
                	Token:token,
                	message:$("#worldmessage").val()
                },Class:'World'
          };
        console.log(msg);
        websocket.send(JSON.stringify(msg));
    }
    function changeStatus(message,code){
    	if(code=='90006'){
    		$("#"+message.fromid+"_status").text("(在线)");
    	}else if(code=='90007'){
    		$("#"+message.fromid+"_status").text("(离线)");
    	}
    }
    function changeOnlineNum(message,code){
    	$("#onlinenum").text("在线人数:"+message.content);
    }
    function setCookie(c_name,value,expiredays)
    {
	    var exdate=new Date()
	    exdate.setDate(exdate.getDate()+expiredays)
	    document.cookie=c_name+ "=" +escape(value)+
	    ((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
    }
    function getCookie(c_name)
    {
	    if (document.cookie.length>0)
	      {
	      c_start=document.cookie.indexOf(c_name + "=")
	      if (c_start!=-1)
	        { 
	        c_start=c_start + c_name.length+1 
	        c_end=document.cookie.indexOf(";",c_start)
	        if (c_end==-1) c_end=document.cookie.length
	        return unescape(document.cookie.substring(c_start,c_end))
	        } 
	      }
	    return ""
    }
</script>
</html>